<div class="dialog-container mdl-shadow--8dp mdl-layout--fixed-header mobile-dialog inspectSkill-dialog">
    <div class="kmi-header-row">
        <div class="header-title">
            <label class="value" ng-bind="(dialog.type==0) ? dialog.machine : dialog.position"></label>
        </div>
        <div class="kmi-side-btn right" ng-click="dialog.back();">
            <img src="image/icons/clear.png"></img>
            <div class="kmi-can-click"></div>
        </div>
    </div>
    <div class="kmi-layout-main-content">
        <div class="kmi-layout-page" style="padding: 8px 16px 0px;flex: initial;">
            <div class="kmi-text-fields">
                <label class="label" ng-bind="'home.inspectSkill.employee' | translate"></label>
                <label class="value" ng-bind="dialog.employee"></label>
                <label class="label" ng-bind="'home.inspectSkill.user_title' | translate"></label>
                <label class="value" ng-bind="dialog.user_title"></label>
            </div>
        </div>
        <div class="kmi-list" style="border-top: 1px #cecece solid;">
            <div class="kmi-list__row-content">
                <div class="row-content" ng-repeat="item in dialog.inspect_detail track by $index">
                    <div class="kmi-row-fields">
                        <div class="column-item left row-title">
                            <label class="label" ng-bind="item.require_skill_no+'('+item.require_skill_name+')'"></label>
                        </div>
                        <div class="column-item right" style="align-items: center;">
                            <i class="material-icons dashboard-light-panel" style="font-size: 22px;" ng-class="[dialog.getLight(item)]">lens</i>
                        </div>
                    </div>
                    <div class="kmi-row-fields">
                        <div class="column-item">
                            <label class="label" ng-bind="'home.inspectSkill.require_grade_name' | translate"></label>
                            <label class="value" ng-bind="item.require_grade_name" ng-style="dialog.getTextColor(item);"></label>
                        </div>
                    </div>
                    <div class="kmi-row-fields">
                        <div class="column-item">
                            <label class="label" ng-bind="'home.inspectSkill.user_grade_name' | translate"></label>
                            <label class="value" ng-bind="item.user_grade_name"></label>
                        </div>
                    </div>
                    <div class="kmi-row-fields">
                        <div class="column-item">
                            <label class="label" ng-bind="'home.inspectSkill.exp_hour' | translate"></label>
                            <label class="value" ng-bind="item.exp_hour"></label>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="kmi-mobile__btn-content">
            <button class="kmi-button__mobile" ng-click="dialog.forceOnWork();">
                <label ng-bind="'home.inspectSkill.btn.force_on_work' | translate"></label>
                <div class="kmi-can-click"></div>
            </button>
            <!-- <button class="kmi-button__mobile" ng-click="dialog.cancelOnWork();">
                <label ng-bind="'home.inspectSkill.btn.cancel_on_work' | translate"></label>
                <div class="kmi-can-click"></div>
            </button> -->
        </div>
    </div>
</div>
